import { useRef } from "react";
import Counter from "./components/counter";

const Chapter6 = (props) => {
    const { title } = props;
    const counterRef = useRef(null);
    const resetCounter = () => {
        counterRef.current.reset();
    };
    return (
        <div className='wrapper wrapper6'>
            <div className='page-header'>
                <h3>{title}</h3>
            </div>
            <div className='page-content'>
                <Counter ref={counterRef} />
                <hr />
                <button
                    className='btn btn-block btn-primary'
                    onClick={resetCounter}
                >
                    重置Counter的值
                </button>
            </div>
        </div>
    );
};

export default Chapter6;
